/** 需求：双向绑定失效如何处理？ */
<template>
  <div class="home">
    <el-input v-model="hhh" placeholder="缓存记录" />
    <div>
      <el-button type="primary" @click="mdfName">改变姓名</el-button>
    </div>
    <!-- <el-input v-model="person.name" placeholder="请输入姓名"></el-input> -->
    <div>{{ person.name }}</div>
    <hr>
    <div>
      <div
        v-for="(item, index) in school"
        :key="index"
        @click="mdfChecked(item)"
      >
        {{ item.name }}: {{ item.checked ? "选中" : "未选中" }}
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: 'Bind',
  data() {
    return {
      hhh: '',
      hhh1: '',
      person: {
        name: ''
      },
      school: [],
      reqData: [
        {
          name: '上海一中'
        },
        {
          name: '上海er中'
        }
      ]
    }
  },
  created() {
    this.school = this.reqData
    this.school.forEach((item) => {
      this.$set(item, 'checked', false)
    })
    console.log('this.school--', this.school)
  },
  activated() {
    // this.hhh = 'qwqwqww'
    console.log('1111111')
  },
  methods: {
    mdfChecked(item) {
      item.checked = !item.checked
      console.log('this.school--', this.school)
    },
    mdfName() {
      this.person.name = Math.random().toFixed(3)
      console.log('this.person.name--', this.person.name)
    }
  }
}
</script>
